.casos-service {
    position: relative;
    margin-top: 1rem;
    padding-bottom: 8rem;
}

.casos-service .casos-color {
    padding-top: 2rem;
    position: relative;
}

.casos-service .casos-color .bg-color {
    background: var(--main-blue);
    /* height: 60rem; */
    position: relative;
}
.casos-service .casos-color .bg-color h2 {
    font-family: "GraphikBold";
    padding-left: 2%;
    position: absolute;
    margin-top: 1rem;
}
.casos-service .casos-color .bg-color .casos-cont {
    position: relative;
    margin-top: 4rem;
    width: 90%;
    left: 5%;
    z-index: 9;
}

.casos-service .casos-color .casos-cont img {
    height: 300px;
    aspect-ratio: 4 / 1;
    object-position: center center;
    object-fit: cover;
}

.casos-service .mensaje {
    position: relative;
    /* width: 80%; */
    background: black;
    font-family: AbelRegular;
    text-align: center;
    font-size: 1.25rem;
    top: 0;
    padding: 1.5% 1%;
    color: white;
    margin-left: 3%;
    margin-right: 3%;
    margin-top: 3%;
}
@media (max-width: 991px) {
    .casos-service .mensaje {
        font-size: 0.75rem;
    }
    .casos-service .casos-color .bg-color {
        /* height: 30rem; */
    }
    .casos-service .casos-color .casos-cont {
        position: relative;
        margin-top: -25rem;
        width: 90%;
        text-align: center;
        z-index: 9;
    }

    .casos-service .casos-color .casos-cont img {
        height: 300px;
        aspect-ratio: 4 / 1;
        object-position: center center;
        object-fit: cover;
    }
}
@media (max-width: 580px) {
    .casos-service .casos-color .bg-color {
        /* height: 140vw; */
    }

    /* .casos-service .casos-color .casos-cont img {
        height: 300px;
        aspect-ratio: 4 / 3;
        object-position: center center;
        object-fit: cover;
    } */
}